<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/mobile-header.jsp"%>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1.0, user-scalable=0">
<title>商品详情</title>
<link href="${ctxStatic }/site/themes/default/css/boilerplate.css" rel="stylesheet" type="text/css">
<link href="${ctxStatic }/site/themes/default/css/css.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="${ctxStatic }/site/themes/default/js/jQuery.js"></script>
<script type="text/javascript" src="${ctxStatic }/site/themes/default/js/swipe.js"></script>
<script type="text/javascript" src="${ctxStatic }/site/themes/default/js/zepto.js"></script>

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript"></script>
<script src="${ctxStatic}/site/themes/default/js/hideOptionMenu.js" type="text/javascript"></script>

<style type="text/css">
.showbox {
	position: fixed;
	top: 0;
	left: 65%;
	opacity: 0;
	filter: alpha(opacity=0);
	margin-left: -80px;
}
*html .showbox, *html .overlay {
	position: absolute;
top:expression(eval(document.documentElement.scrollTop));
}
#AjaxLoading div.loadingWord {
	width: 180px;
	height: 30px;
	line-height: 30px;
	background: #000;
	border-radius: 3px;
	box-shadow: 2px 2px 5px #999;
	color: #FFF;
	text-align: center
}
</style>
<script>
	$(function(){
		new Swipe(document.getElementById('banner_box'), {
			speed:500,
			callback: function(){
				var lis = $(this.element).next("ol").children();
				lis.removeClass("on").eq(this.index).addClass("on");
			}
		});
	});
</script>
</head>
<body>
<div class="gridContainer clearfix" id="product">
<div id="LayoutDiv1" style="min-height: 453px;"> 
 	<header><span class="left biaoti icon_left" onclick="history.back(-1)">花卉详情</span><span class="icon_menu right"></span></header>
	<div style=" clear:both;width:100%;overflow-X: hidden;margin-top:50px;">
		<div id="banner_box" class="box_swipe" style="visibility: visible;">
	        <ul style="list-style: none; width: 4480px; transition: 500ms; -webkit-transition: 500ms; -webkit-transform: translate3d(-1280px, 0, 0);">
	        	<c:forEach items="${flower.flowerImg }" var="flowerImg">
		          <li style="width: 640px; display: table-cell; vertical-align: top;"> 
		          	<a onclick="${ctxMobileSite }/viewImgs/${flower.id}"> 
		          		<img src="${ctxUser }/flower/${flowerImg.img}" alt="1" style="width:100%;"> </a> 
		          </li>
	        	</c:forEach>
	        </ul>
	        <ol>
	        	<c:forEach items="${flower.flowerImg }" var="flowerImg" varStatus="var" >
	        		<li ${var.count eq 0?'class="on"':'' } ></li>
	        	</c:forEach>
	        </ol>
	        <c:if test="${empty flower.flowerImg }">
        		<span style="width: 640px; display: table-cell; vertical-align: top;"> 
		       		<a onclick="${ctxMobileSite }/viewImgs/${flower.id}"> 
		       		<img src="${ctxUser }/flower/${flower.coverImg}" alt="1" style="width:100%;"> </a> 
		        </span>
	        </c:if>
	     <div class="title">${flower.name}</div>
	    </div>
		   
	</div>
	<section class="clear">
      
      <div class="bgbaise" >
      	<c:if test="${flower.isSale eq '1' }">
	        <p>
	        	<span class="font18">出售价格：</span> 
	        	<span class="font20red">￥<fmt:formatNumber value="${flower.salePrice/100 }" pattern="0.00"/></span>
	        </p>
      	</c:if>
      	<c:if test="${flower.isLease eq '1' }">
        	<p>
        		<span class="font18">出租价格：</span> 
        		<span class="font20red">￥<fmt:formatNumber value="${flower.leasePrice/100 }" pattern="0.00"/></span>
        	</p>
     	</c:if>
     	<p>剩余数量：
        	<c:if test="${flower.total-flower.saleNum > 0}">
        		<c:out value="${flower.total-flower.saleNum}" default="0"></c:out>件
        	</c:if>
        	<c:if test="${flower.total-flower.saleNum <= 0}">已售完</c:if>
        	
        </p>
      </div>
      <div class="guige clear">
        <p style="padding-bottom:10px;" class="font16">
        	<span>返利积分</span>
        	<span class="right" style="color:red"><fmt:formatNumber value="${flower.score/1000}" pattern="##.###"  minFractionDigits="3"/></span>
        </p>
        <div style="padding-top:10px; border-top:1px #eee solid">
        	<span class="font16">最多可使用积分</span>
        	<span class="right" style="color:red"><fmt:formatNumber value="${product.consumeScore/1000}" pattern="##.###"  minFractionDigits="3"/></span>
        </div>
      </div>
      
      <div class="guige"><span class="font18">图文详解:&nbsp;</span></div>
       <div style="font-size: 13px; padding:15px;line-height: 20px;background-color: #f8f8f8;min-height: 23%;"> ${flower.description }</div>
    </section>    
	<footer class="tbl-type detail-tbn2"  style="position: fixed; left: 0px; bottom: 0px; z-index: 10; display: table;">
        <div class="tbl-cell"> 
	        <%-- <a class="btn-buy" href="${ctxMobileSite}/shopping/createFlowerPay?flowerId=${flower.id}&uid=${uid}&wechatId=${wechatId}&buyWay=1"><span></span>立即购买</a> --%>
	        <c:if test="${flower.isSale eq '1' }">
	        	<c:if test="${flower.total-flower.saleNum > 0}">
	        		<input onclick="javascript:window.location.href='${ctxMobileSite}/shopping/createFlowerPay?flowerId=${flower.id}&uid=${uid}&wechatId=${wechatId}&buyWay=1&productNumber=1'" class="anniu btn-buy" type="submit" value="立即购买"  style="padding: 5% 18% 5% 18%; margin:5%;color: #fff;font-size: 16px;" /> 
	        	</c:if>
	        	<c:if test="${flower.total-flower.saleNum <= 0}">
	        		<input onclick="alert('商品已售完！');" class="anniu btn-buy" type="submit" value="立即购买"  style="padding: 5% 18% 5% 18%; margin:5%;color: #fff;font-size: 16px;" /> 
				</c:if>
			</c:if>	
			<c:if test="${flower.isSale ne '1' }">
				<input onclick="alert('商品暂不出售！');" class="anniu btn-buy" type="submit" value="立即购买"  style="padding: 5% 18% 5% 18%; margin:5%;color: #fff;font-size: 16px;background-color: #666;" /> 
			</c:if>
        </div>
        <div class="tbl-cell"> 
        	<%-- <a class="btn-cart" href="${ctxMobileSite}/shopping/createFlowerPay?flowerId=${flower.id}&uid=${uid}&wechatId=${wechatId}&buyWay=2"><span></span>在线租赁</a> --%> 
        	<c:if test="${flower.isLease eq '1' }">
	        	<c:if test="${flower.total-flower.saleNum > 0}">
	        		<input onclick="javascript:window.location.href='${ctxMobileSite}/shopping/createFlowerPay?flowerId=${flower.id}&uid=${uid}&wechatId=${wechatId}&buyWay=2&productNumber=1'" class="anniu btn-cart" type="submit" value="在线租赁"  style="padding: 5% 17% 5% 17%; margin:5%;color: #fff;font-size: 16px;" />
	        	</c:if>
	        	<c:if test="${flower.total-flower.saleNum <= 0}">
	        		<input onclick="alert('商品已售完！');" class="anniu btn-cart" type="submit" value="在线租赁"  style="padding: 5% 17% 5% 17%; margin:5%;color: #fff;font-size: 16px;" />        		
				</c:if>
			</c:if>
			<c:if test="${flower.isLease ne '1' }">
				<input onclick="alert('商品暂不出租！');" class="anniu btn-buy" type="submit" value="在线租赁"  style="padding: 5% 18% 5% 18%; margin:5%;color: #fff;font-size: 16px;background-color: #666;" /> 
			</c:if>
        </div>
    </footer>
</div>
<div class="jszch" style="margin-bottom:60px;">技术支持：<a href="http://www.hdzhx.com/boxin/index.html" >智讯互联</a></div>
</div>
</body>
</html>
